@import "../../css/_variables";


.v[data-class=v] {
    .vbtn {
        color: $global-font-color;
        [theme=dark] & {
            color: $global-font-color-dark;
        }
        [theme=black] & {
            color: $global-font-color-black;
        }
    }
    .vicon {
        fill: $global-font-color;
        [theme=dark] & {
            fill: $global-font-color-dark;
        }
        [theme=black] & {
            fill: $global-font-color-black;
        }
    }
    code, pre {
        background-color: $code-background-color;
        [theme=dark] & {
            background-color: $code-background-color-dark;
        }
        [theme=black] & {
            background-color: $code-background-color-black;
        }   
    }
    .status-bar, .veditor, .vinput, p, pre code {
        color: $global-font-color;
        [theme=dark] & {
            color: $global-font-color-dark;
        }
        [theme=black] & {
            color: $global-font-color-black;
        }
    }
    .vcards .vcard {
        .vh, .vquote {
            border: none;
        }
        .vcontent.expand:after {
            color: $global-font-color;
            background: $global-background-color;
            [theme=dark] & {
                color: $global-font-color-dark;
                background: $global-background-color-dark;
            }
            [theme=black] & {
                color: $global-font-color-black;
                background: $global-background-color-black;
            }
        }
        .vcontent.expand:before {
            background: linear-gradient(180deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.9));
            [theme=dark] & {
                background: linear-gradient(180deg,hsla(0,0%,100%,0),#292a2de6);
            }
            [theme=black] & {
                background: linear-gradient(180deg,hsla(0,0%,100%,0),#000000e6);
            }
        }
    }
}
